import React, {Component} from 'react';
import {StyleSheet, Text, View, Image, 
  TouchableOpacity,Dimensions
} from 'react-native';
const {height, width} = Dimensions.get('window');

export default class VipPower extends Component{
  _renderContent(){
    let data = this.props.data;
    console.log('data',data);
    let array = [];
    for(let i=0; i<data.length; i++){
      let item = data[i];
      array.push(
        <View style={styles.cellView} key={i}>
          <Image style={styles.imgStyle} source={item.img}/>
          <Text style={styles.textStyle}>{item.text}</Text>
        </View>
      )
    }
    return array;
  }
  render(){
    return(
      <View style={[styles.contentView,this.props.style]}>
        {this._renderContent()}
      </View>
    )
  }


}
const styles = StyleSheet.create({
  textStyle:{
		paddingBottom:10,
		color:'white'
  },
  cellView:{
    width:width/4,
    // borderColor:'red',
    // borderWidth:StyleSheet.hairlineWidth,
    alignItems: 'center'
  },
  imgStyle:{
    width:width/8,
    height:width/8,
    margin:5,
  },
  contentView:{
    flexDirection:'row',
    flexWrap:'wrap',
    //backgroundColor:'#f0f0f0',
  }
})